<template>
	<view class="container">


		<swiper :indicator-dots="true" :autoplay="true" :interval="3000" :duration="1000" >
			<swiper-item v-for="(item,i) in list" :key="i">
				<view class="swiper-item">
					<image :src="item.picUrl" mode="">
					</image>
				</view>
			</swiper-item>
			
		</swiper>

		<view class="Productlist">
			<image src="https://v-shop.shuzp.top/assets/static/line_askew.202211141410.png" mode=""></image>
			<text>商品列表</text>
			<image src="https://v-shop.shuzp.top/assets/static/line_askew.202211141410.png" mode=""></image>
		</view>

		<view class="conter">


			<view class="conterbox" v-for="(r,i) in list1" :key="r.id" @click="cli">
				<image :src="r.pic" mode=""></image>
				<text>{{r.name}}</text>
				<view class="conterbox1">
					<text class="text1">￥</text>
					<text class="text2">{{r.minPrice}}</text>
					<text class="text3">￥{{r.originalPrice}}</text>
				</view>
			</view>
			
			
		</view>


	</view>
</template>


<script>
	export default {
		data() {
			return {
				list:[],
				list1:[]
			}
		},
		components: {

		},
		onLoad() {
			this.getlist()
			this.getlist1()
		},
		methods: {
			getlist(){
				const that=this
				uni.request({
					url:"https://api.it120.cc/xiaochengxu/banner/list",
					method:"get",
					dataType:"json",
					success(res) {
						// console.log(res.data.data)
						that.list=res.data.data
					}
				})
			},
			getlist1(){
				const that=this
				uni.request({
					url:"https://api.it120.cc/xiaochengxu/shop/goods/list/v2",
					method:"post",
					dataType:"json",
					success(res) {
						console.log(res.data.data.result)
						that.list1=res.data.data.result
					}
				})
			},
			cli(){
				uni.navigateTo({
					url: '../PhysicalCommodity/PhysicalCommodity'
			})
			}
		},
	}
</script>

<style lang='scss' scoped>
	.container {
		display: flex;
		flex-direction: column;
	}

	swiper {
		width: 100%;
		height: 260rpx;
	}

	.swiper-item image {
		width: 100%;
		height: 260rpx;
	}

	.Productlist {
		margin-top: 40rpx;
		display: flex;
		justify-content: center;
		align-items: center;
	}

	.Productlist image {
		width: 5.33vw;
		height: 1.6vw;
	}

	.Productlist {
		font-size: 4.27vw;
	}

	.Productlist text {
		margin: 20rpx;
	}

	.conter {
		display: flex;
		justify-content: space-between;
		margin: 50rpx;
		flex-wrap: wrap;
	}

	.conterbox {
		display: flex;
		align-items: center;
		justify-content: center;
		flex-direction: column;
		font-size: 3.73vw;
		width: 45%;
	}

	.conterbox image {
		width: 100%;
	}

	.conterbox1 {
		width: 100%;
		margin-left: 0.53vw;
		position: relative;
	}

	.conterbox1 .text1 {
		font-size: 3.2vw;
		color: #1ba784;
	}

	.conterbox1 .text2 {
		font-size: 4.8vw;
		color: #1ba784;
	}

	.conterbox1 .text3 {
		font-size: 3.2vw;
		color: #969799;
		text-decoration: line-through
	}
</style>